<template>
    <view class="container">
        <view class="logo">
            <image class="logo-img" src="/static/logo.png" @click="tikFn()"></image>
            <text>您好，欢迎登录！</text>
        </view>
        <view class="h5-box" v-if="refresh">
            <view class="card-group">
                <view class="title" v-if="false">登录账号</view>
                <card-cell-input-login
                    :adjust="true"
                    :showLabel="false"
                    showIcon
                    class="border-bot"
                    ref="userName"
                    label="/static/icon/icon_login_username.png"
                    :inputType="'number'"
                    value=""
                    placeholder="请输入您的手机号"></card-cell-input-login>
            </view>
            <view class="card-group">
                <view class="title" v-if="false">密码</view>
                <card-cell-input-login
                    :adjust="true"
                    v-if="isPwdType"
                    showIcon
                    class="border-bot"
                    :showLabel="false"
                    ref="password"
                    label="/static/icon/icon_login_pwd.png"
                    value=""
                    :inputType="'password'"
                    placeholder="请输入登录密码">
                </card-cell-input-login>
            </view>
            <button class="btn btn-success btn-save" @click="loginByService">立即登录</button>
        </view>
        <uni-popup ref="tip" type="dialog">
            <uni-popup-dialog
                type="text"
                title="温馨提示"
                content="登录商户后台点击右上角的商户名称,可以查看商户ID号"
                :before-close="false"
                @confirm="save"></uni-popup-dialog>
        </uni-popup>
        <pop-check-cut ref="popCheckCut" :datas="datas" @selected="selected"></pop-check-cut>
        <!-- 切换环境 -->
        <uni-popup ref="popServe" type="bottom" background-color="#fff" :safe-area="false">
            <view class="bottom-pop">
                <text class="title">切换环境</text>
                <view class="actions">
                    <button class="btn btn-gray-hollow" @click="selectServer(1)">正式</button>
                    <button class="btn btn-gray-hollow" @click="selectServer(9)">测试</button>
                </view>
            </view>
        </uni-popup>
    </view>
</template>

<script>
import { mapMutations, mapState } from "vuex"

import cardCellInputLogin from "@/components/common/cell/card-cell-input-login.vue"
import popCheckCut from "@/uni-sub-base/module/cutAccount/cut-account.vue"
import storage from "@/uni-sub-base/utils/storage.js"
import config from "@/config/config.js"

import { getGuideInfo } from "@/utils/appInit.js"
import { setBaseUrls } from "@/utils/appUrl.js"
import { Login } from "@/service/api/authorize.js"
import { GetGuideApiUrl } from "@/service/api/web.js"
import { GetAdminUserSystemList } from "@/service/api/user.js"
export default {
    components: {
        cardCellInputLogin,
        popCheckCut,
    },
    data() {
        return {
            isPwdType: true,
            url: "",
            isShow: false,
            businessCode: "",
            refresh: true,
            isShowSelect: false,
            datas: [],
            tikNum: 0,
        }
    },
    onLoad(e) {},
    mounted() {
        let businessCode = storage.getCache("businessCode")
        if (businessCode) {
            //有企业号要直接输入
            this.businessCode = businessCode
        }
        //登录页清除appBaseUrl
        let appBaseUrl = storage.getCache("appBaseUrl")
        if (appBaseUrl) {
            storage.removeCache("appBaseUrl")
        }
    },
    methods: {
        ...mapMutations(["SET_AUTH"]),
        loginByService() {
            let userName = this.$refs.userName.getValue()
            let password = this.$refs.password.getValue()

            if (userName.trim() == "") {
                this.easyToast("请输入手机号")
                return
            }
            if (password.trim() == "") {
                this.easyToast("请输入密码")
                return
            }
            uni.showLoading({
                title: "登录中",
            })
            let param = {
                userName: userName,
                password: password,
                type: 1,
            }
            this.loginFn(param)
        },
        loginByAccount(item) {
            uni.showLoading({
                title: "登录中",
            })
            let param = {
                type: 1,
                shopId: item.ShopId,
                userId: item.UserId,
            }
            Login(param).then((res) => {
                if (res.State == 1 && res.Data) {
                    let token = res.Data.Token
                    let role = res.Data.PositionFunCodes
                    if (role) {
                        storage.setCache("roleArr", role)
                    }
                    this.SET_AUTH(token)
                    storage.setCache("token", token)
                    storage.setCache("jobPosition", res.Data.JobPosition)
                    let businessDomain = "https://" + res.Data.MobileDomain
                    storage.setCache("businessDomain", businessDomain)
                    if (item.DomainApiName) {
                        let businessDomain = item.DomainApiName.includes("http")
                            ? item.DomainApiName
                            : "https://" + item.DomainApiName
                        setBaseUrls(businessDomain)
                    }
                    uni.hideLoading()
                    storage.removeCache("webInfo")
                    this.getGuideInfoFn()
                } else {
                    uni.hideLoading()
                    this.easyToast(res.Msg)
                }
            })
        },
        //登录
        loginFn(param) {
            Login(param).then((res) => {
                if (res.State == 1 && res.Data) {
                    let token = res.Data.Token
                    let webInfo = {
                        Token: token,
                    }
                    //临时保存
                    storage.setCache("webInfo", webInfo)

                    setTimeout((e) => {
                        //获取登录者信息
                        this.getAdminUserSystemList()
                    }, 500)
                } else {
                    uni.hideLoading()
                    this.easyToast(res.Msg)
                }
            })
        },
        //获取平台商户
        getAdminUserSystemList() {
            GetAdminUserSystemList().then((res) => {
                console.log(res)
                if (res.State == 1 && res.Data && res.Data.length > 0) {
                    this.datas = res.Data
                    this.selected(this.datas[0])
                    // if(res.Data.length>1){
                    // 	uni.hideLoading()
                    // 	//2个以上
                    // 	this.$refs.popCheckCut.openPop()
                    // }else{
                    // 	//1个
                    // 	this.selected(this.datas[0])
                    // }
                } else {
                    uni.hideLoading()
                    this.easyToast(res.Msg)
                }
            })
        },
        getGuideInfoFn() {
            getGuideInfo().then((res) => {
                this.$nextTick(() => {
                    this.easyReLaunch("/pages/index/index")
                })
            })
        },
        tip() {
            this.$refs.tip.open()
        },
        save() {},
        selected(item) {
            this.loginByAccount(item)
        },
        tikFn() {
            this.tikNum += 1
            if (this.tikNum >= 10) {
                //弹窗切换环境
                this.$refs.popServe.open()
            }
        },
        selectServer(type) {
            //1正式 0 测试
            storage.setCache("appService", type)
            this.doLogout()
        },
        //退出登录
        doLogout() {
            this.tikNum = 0
            setTimeout(() => {
                this.easyReLaunch("/pages/login/index")
            }, 300)
        },
    },
}
</script>

<style lang="scss">
page {
    background: #ffffff;
}

.container {
    padding: 0rpx 0rpx 0;
}

.btn-save {
    margin-top: 24rpx;
    height: 88rpx;
    width: 100%;
    border-radius: 100rpx;
}

.logo {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    margin-top: 60rpx;
    padding: 6rpx;

    .logo-img {
        width: 140rpx;
        height: 140rpx;
        margin-top: 95rpx;
        display: block;
        border-radius: 20rpx;
        padding: 0;
        margin-bottom: 24rpx;
    }

    .showbox {
        width: 168rpx;
        height: 32rpx;
        display: block;
        margin-top: 8rpx;
    }

    text {
        font-size: $font-size-40;
        font-weight: bold;
    }
}

.title {
    font-size: 36rpx;
    color: $color-gray-1;
    padding-left: 24rpx;

    .icon-question {
        padding-left: 10rpx;
    }
}

.logo_bg {
    width: 100%;
    // height: 472rpx;
}

.h5-box {
    padding: 64rpx 72rpx 0;
    display: flex;
    flex-direction: column;
    position: relative;
    border-radius: 64rpx 64rpx 0px 0px;
    background: #ffffff;

    .link-box {
        display: flex;
        flex-direction: row;
        height: 60rpx;
        justify-items: center;

        .change-type {
            display: flex;
            flex: 1;
            color: $app-color-text-tip;
        }

        .forget-pwd {
            display: flex;
            flex: 1;
            justify-content: flex-end;
            color: $app-color-text-tip;
        }
    }

    .card-group {
        margin-bottom: 40rpx;
    }

    .register-tip {
        margin-top: 30rpx;
        display: flex;
        justify-content: center;

        .link-text {
            color: $app-color-main;
        }
    }
}

.border-bot {
    .input {
        font-size: 36rpx !important;
    }

    border-bottom: 1rpx solid #f0f0f0;
}
</style>
